import React from 'react'
import styles from '../css/Item.module.css'
import { useNavigate } from 'react-router-dom'

function Item(porps) {
let nav = useNavigate()
    return (
        <div>
            
            <div className={styles.box} onClick={()=>{
                nav(`/xq/:id?id=${porps.id}&start=${porps.startStation}&end=${porps.endStation}`)
            }}>
                <div>
                    <div className={styles.left}>
                        <span>{porps.startTime}</span>
                        <span>{porps.trainNo}</span>
                        <span>{porps.endTime}</span>
                        <span>{porps.startStation}</span>
                        <span>1h12m</span>
                        <span>{porps.endStation}</span>
                    </div>
                    <div className={styles.too}>
                        <div>二等座{porps.ssoftSeat.ticketNum}</div>
                        <div>一等座{porps.fsoftSeat.ticketNum}</div>
                        <div>特等座{porps.businessSeat.ticketNum}</div>
                    </div>
                </div>
                <div style={{ fontSize: '22px' }}>{porps.ssoftSeat.price}起</div>
            </div>
        </div>
    )
}

export default Item
